$(function(){
    // 1. 选择便签类型
    $('#type img').click(function(){
        $('#type .selected').removeAttr('class');
        $(this).prop('class','selected');
        // 改变预览的便签背景
        var tagnum = $(this).data('tag');
        var colornum = $('#color .selected').data('color');
        $('#preview').css('background', "url('../static/image/release/tag"+tagnum+"_color"+colornum+".png') no-repeat");
        $('#preview').prop('class',"tag"+tagnum+"_preview");
        // 改变表单中便签类型代号
        $('[name=type_num]').val(tagnum);
    });
    // 2. 选择颜色类型
    $('#color i').click(function(){
        $('#color .selected').removeAttr('class');
        $(this).prop('class','selected');
        // 改变预览的便签背景
        var tagnum = $("#type .selected").data('tag');
        var colornum = $(this).data('color');
        $('#preview').css('background', "url('../static/image/release/tag"+tagnum+"_color"+colornum+".png') no-repeat");
        // $('#preview').prop('class',"tag"+tagnum+"_preview") 
        // 改变表单中便签颜色代号
        $('[name=type_num]').val(colornum);       
    });
    // 3.日期变动时联动
    $('#content .date').change(function(){
        var date = new Date($(this).val());
        var year = date.getFullYear();
        var month = date.getMonth();
        var day = date.getDate();
        var weekday = date.getDay();
        var weekdaystr;
        switch(weekday){
            case 1:{
                weekdaystr = '星期一';
                break;
            }
            case 2:{
                weekdaystr = '星期二';
                break
            }
            case 3:{
                weekdaystr = '星期三';
                break
            }     
            case 4:{
                weekdaystr = '星期四';
                break
            }    
            case 5:{
                weekdaystr = '星期五';
                break
            }       
            case 6:{
                weekdaystr = '星期六';
                break
            }        
            case 0:{
                weekdaystr = '星期天';
                break
            }                                    
        };
        var dateStr = year+'年'+month+'月'+day+'日 '+weekdaystr;
        $('#preview .date').html(dateStr);
    });
    // 4.输入内容时联动
    $('#content textarea').bind('input',function(){
        $('#preview .content').html($(this).val());
    });
})